<template>
    <basic-container>
        <div class="crumbs">
            <el-breadcrumb separator="/">
                <el-breadcrumb-item><i class="el-icon-setting"></i> 发货管理</el-breadcrumb-item>
                <el-breadcrumb-item><i class="el-icon-date"></i> 发货详情</el-breadcrumb-item>
            </el-breadcrumb>
        </div>
        <avue-detail ref="form" v-model="form" :option="formOption">
        </avue-detail>
        <avue-detail ref="form" v-model="form" :option="formOption2">
        </avue-detail>
        <avue-crud
                ref="crud" :option="detailOption"
                :data="detailList"
        ></avue-crud>
        <div class="goBackBtn">
            <el-button type="primary" @click="goBack">返 回</el-button>
        </div>
    </basic-container>
</template>

<script>
    import {fetchInfo} from '../../api/opc/ship_record';
    import {formOption} from '../../const/crud/opc/form_option/ship_record';
    import {formOption as formOption2} from '../../const/crud/opc/form_option/ship_record_send';
    import {formOption as detailOption} from '../../const/crud/opc/form_option/ship_detail';
    import {goBack} from "../../util/util";

    export default {
        data() {
            return {
                form: {},
                formOption: formOption,
                formOption2: formOption2,
                detailOption: detailOption,
                detailList: []
            }
        },
        computed: {},
        created() {
        },
        beforeRouteEnter(to, from, next) {
            next(vm => vm.fetchDetail(vm.$route.query.res.shipRecordSn));
        },
        methods: {
            fetchDetail(shipRecordSn) {
                fetchInfo({shipRecordSn:shipRecordSn}).then(response => {
                    this.form = response.data.data;
                    this.detailList = this.form.detailList;
                }).catch(() => {
                    this.goBack();
                })
            },
            goBack(time = 1000) {
                goBack(this, time);
            }
        }
    }
</script>

<style scoped lang="scss" scoped>
    .crumbs {
        margin: 20px 10px;
    }
    .goBackBtn {
  margin: 40px 0 40px 0;
  border-radius: 10px;
}
</style>


